<template>
  <el-container>
    <el-header class="header">
      <Header></Header>
    </el-header>

    <el-container>
      <!-- <el-aside width="200px">
        <Aside></Aside>
      </el-aside> -->
      <el-main>
        <router-view />
        <el-backtop :right="100" :bottom="100" />
      </el-main>
    </el-container>

    <!-- <el-footer>
      <Footer></Footer>
    </el-footer> -->
  </el-container>
</template>

<script>
import Header from '@/components/Header.vue'
import Footer from '@/components/Footer.vue'
import Aside from '@/components/Aside.vue'
import { useStore } from 'vuex'

export default {
  name: 'index',
  components: {
    Footer,
    Header,
    Aside
  },
  setup() {
    const store = useStore()
    store.dispatch('user/getInfo')
  }
}
</script>

<style>
.header {
  height: 100%;
}
.el-header {
  --el-header-padding: 0 0;
  height: 70px;
}
</style>
